<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Title</title>
</head>
<body>
<!--key的作用是为了高效更新DOM   使用了key以后，会使用diff算法来插入元素，会先把index和值进行绑定-->
<!--不使用key的时候，会依次去替换数组中的元素-->
<!--splice(a,b,c)   a表示从第几个位置开始    b表示删除几个元素    c表示插入的元素-->
<div id="app">
  <ul>
    <li v-for="item in letters" :key="item">
        {{item}}
    </li>
  </ul>
</div>


<script src="../js/vue.js"></script>
<script>
    const app = new Vue({
        el:'#app',
        data:{
            letters:['a','b','c','d']
        }
    })
</script>
</body>
</html>